﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="wfTouristInfo.aspx.cs" Inherits="msBsc.WebUi.wMall.Buyer.wfTouristInfo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="地接客，旅游，申请成为地接客，旅游包车专家" />
    <title>个人中心</title>
    <link href="/themes/wStyle1/css/sLayout.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sHead.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/sFoot.css" rel="stylesheet" />
    <link href="/jqPlugin/laydate/skins/default/laydate.css" rel="stylesheet" />
    <link href="/jqPlugin/SelectSimu/css/base.css" rel="stylesheet" />
    <link href="/jqPlugin/hdfu/hdfu.css" rel="stylesheet" />

    <link href="/themes/wStyle1/css/Seller/sDjackInfo.css" rel="stylesheet" />
    <link href="/jqPlugin/layer/skin/layer.css" rel="stylesheet" />
    <link href="/themes/wStyle1/css/usermenu.css" rel="stylesheet" />
</head>
<body>
    <div class="wf_all">
        <div id="divLoginInfo">
            <%=msBsc.WebUi.Code.QtHtmlGet.GetHeaderLoginInfo() %>
        </div>
        <div class="main-container">
            <div class="sidebar-scroll">
                <%=msBsc.WebUi.Code.QtHtmlGet.GetTouristMenuHtml() %>
            </div>
            <div class="main-Info">
                <div class="tnavigation">
                    <a class="nav" href="#">我的地接客</a>&gt;
				        <a class="nav" href="#">个人中心</a>&gt;
				        <a class="nav-on" href="#">个人资料</a>
                </div>
                <div class="listmenu">
                    <ul id="wSlist" class="list">
                        <li class="selected">
                            <a class="link" href="javascript:;">
                                <span>个人资料</span>
                                <i class="interval">|</i>
                            </a>
                        </li>
                    </ul>
                    <div class="wrap-line">
                        <span id="sold-boder" class="line" style="left: 0px;"></span>
                    </div>
                </div>
                <div class="modle">
                    <ul class="main-horizontal">
                        <!-- BEGIN 头像 -->
                        <li>
                            <span class="control-span">头像<span class="required" style="display: none;">*</span></span>
                            <div class="controls">
                                <div style="display: inline; float: left;">
                                    <div class="uploadbox" data-count="1" style="display: block">
                                        <div class="pf-avatar-box">
                                            <img src="/UpLoad/Djack/djack.jpg" id="ShowHeadPhoto" />
                                        </div>
                                    </div>
                                </div>
                                <div id="photoMessage" class="help-inline"></div>
                            </div>
                        </li>
                        <!-- END 头像 -->
                        <!-- BEGIN 昵称 -->
                        <li>
                            <span class="control-span">昵称<span class="required" style="display: none;">*</span></span>
                            <div class="controls" id="ShowNickName"></div>
                        </li>
                        <!-- END 昵称 -->
                        <!-- BEGIN 所在地 -->
                        <li>
                            <span class="control-span">所在地<span class="required" style="display: none;">*</span></span>
                            <div class="controls">
                                <span id="ShowAddress" data-value="DF6723BE-A25C-4F77-BB49-A1662D3E6F2A">中国</span> <span id="Span2" data-value=""></span><span id="Span3" data-value=""></span>
                            </div>
                        </li>
                        <!-- END 所在地 -->

                        <!-- BEGIN 性别 -->
                        <li>
                            <span class="control-span">性别<span class="required" style="display: none;">*</span></span>
                            <div class="controls" id="ShowGender"><span data-value="F"></span></div>
                        </li>
                        <!-- END 性别 -->

                        <!-- BEGIN 显示生日-->
                        <li>
                            <span class="control-span">生日<span class="required" style="display: none;">*</span></span>
                            <div class="controls" id="ShowBirth"><span></span></div>
                        </li>
                        <!-- END 显示生日-->

                        <!-- BEGIN QQ -->
                        <li>
                            <span class="control-span">QQ<span class="required" style="display: none;">*</span></span>
                            <div class="controls" id="ShowQQ"></div>
                        </li>
                        <!-- END QQ -->

                        <!-- BEGIN 手机 -->
                        <li>
                            <span class="control-span">手机<span class="required" style="display: none;">*</span></span>
                            <div class="controls" id="ShowMobile"></div>
                        </li>
                        <!-- END 手机 -->

                        <!-- BEGIN 座机 -->
                        <li>
                            <span class="control-span">座机</span><div class="controls" id="ShowPhone"></div>
                        </li>
                        <!-- END 座机 -->

                        <!-- BEGIN 微信 -->
                        <li>
                            <span class="control-span">微信</span><div class="controls" id="ShowWeChat"></div>
                        </li>
                        <!-- END 微信 -->

                        <!-- BEGIN 邮箱 -->
                        <li>
                            <span class="control-span">邮箱<span class="required" style="display: none;">*</span></span>
                            <div class="controls" id="ShowEmail"></div>
                        </li>
                        <!-- END 邮箱 -->
                    </ul>
                    <!-- BEGIN 添加车辆按钮 -->
                    <div class="form-actions" id="editButton">
                        <span onclick="btnChang()" class="up-btn2 tm-skin-yellow2">编 辑</span>
                    </div>
                    <!-- END 添加车辆按钮 -->
                </div>

                <div class="edit" style="display: none">
                    <ul class="main-horizontal">
                        <!-- BEGIN 头像 -->
                        <li>
                            <span class="control-span">头像<span class="required">*</span></span>
                            <div class="controls">
                                <div style="display: inline; float: left;">
                                    <div class="uploadbox" data-count="0" data-value="djack"style="display: block">
                                        <div class="pf-avatar-box" id="imgHead">
                                            <img src="" id="modifyHeadPhoto" />
                                            <a class="pf-edit-avatar" href="javascript:;">编辑头像</a>
                                        </div>
                                    </div>
                                </div>
                                <div class="help-inline"></div>
                            </div>
                        </li>
                        <!-- END 头像 -->
                        <!-- BEGIN 昵称 -->
                        <li>
                            <span class="control-span">昵称<span class="required">*</span></span><div class="controls">
                                <input class="input" type="text" id="txtNickName" value="" />
                                <span id="userNameMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END 昵称 -->
                        <!-- BEGIN 所在地 -->
                        <li>
                            <span class="control-span">所在地<span class="required">*</span></span>
                            <div class="controls" id="location">
                                <div id="country" class="select"></div>
                                <div id="city" class="select"></div>
                                <div id="destion" class="select"></div>
                                <span id="locationMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END 所在地 -->
                        <!-- BEGIN 生日-->
                        <li>
                            <span class="control-span">生日</span><div class="controls">
                                <input type="text" id="BirtDate" class="laydate-icon" onclick="laydate()" />
                                <span id="birtMessage" class="help-inline"></span>
                            </div>
                        </li>
                            <!-- END 生日-->
                        <!-- BEGIN 性别 -->
                        <li>
                            <span class="control-span">性别<span class="required">*</span></span><div class="controls">
                                <input id="radMale" type="radio" style="margin-right: 5px;" name="radGender" value="M" />
                                男
                                <input id="radFemale" type="radio" style="margin-left: 20px; margin-right: 5px;" value="F" name="radGender" />
                                女
                                <span id="sexMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END 性别 -->

                        <!-- BEGIN QQ -->
                        <li>
                            <span class="control-span">QQ</span><div class="controls">
                                <input class="input" id="txtTencentQQ" type="text" value="" />
                                <span id="qqMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END QQ -->

                        <!-- BEGIN 手机 -->
                        <li>
                            <span class="control-span">手机<span class="required">*</span></span><div class="controls">
                                <input class="input" type="text" id="txtMobile" value="" />
                                <span id="mobileMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END 手机 -->

                        <!-- BEGIN 座机 -->
                        <li>
                            <span class="control-span">座机</span><div class="controls">
                                <input id="txtPhoneTitle" class="input" type="text" style="width: 50px" value="" />
                                -
                                <input id="txtPhoneContent" class="input" type="text" style="width: 130px" value="" />
                                <span id="phoneMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END 座机 -->

                        <!-- BEGIN 微信 -->
                        <li>
                            <span class="control-span">微信</span><div class="controls">
                                <input class="input" type="text" id="txtWeChat"  />
                                <span id="microMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END 微信 -->

                        <!-- BEGIN 邮箱 -->
                        <li>
                            <span class="control-span">邮箱<span class="required">*</span></span><div class="controls">
                                <input class="input" type="text" id="txtEmail"  />
                                <span id="emailMessage" class="help-inline"></span>
                            </div>
                        </li>
                        <!-- END 邮箱 -->
                    </ul>
                    <!-- BEGIN 添加车辆按钮 -->
                    <div class="form-actions">
                        <span  onclick="saveUserInfo()" class="up-btn2 tm-skin-red2">保 存</span>
                        <span  onclick="btnCancel()" class="up-btn2 tm-skin-Grey2">取 消</span>
                    </div>
                    <!-- END 添加车辆按钮 -->

                </div>
            </div>
        <div class="ui-mask"></div>
        <div id="altContent">
        </div>
        </div>
        <!--start JS引用-->
        <script src="/jqPlugin/js/jquery-1.8.3.min.js"></script>
        <script src="/jqPlugin/js/jBase.js"></script>
        <script src="/jqPlugin/js/jBPage.js"></script>
        <script src="/jqPlugin/js/laytpl.js"></script>
        <script src="/jqPlugin/laydate/laydate.js"></script>
        <script src="/jqPlugin/SelectSimu/js/SelectSimu.js"></script>
        <script src="/themes/wStyle1/js/comm/VerifyJs.js"></script>
        <script src="/themes/wStyle1/js/comm/DateInfo.js"></script>
        <script src="/jqPlugin/hdfu/hdfu.js"></script>
        <script src="/jqPlugin/layer/layer.min.js"></script>
        <script src="/jqPlugin/SelectSimu/js/SelectSimu.js"></script>
        <script src="/themes/wStyle1/js/comm/jsLayout.js"></script>
        <script type="text/javascript">
            var parentsId = "00000000-0000-0000-0000-000000000000";
            var currentCountry = "";
            var currentCity = "";
            (function () {
                $('#country .selectList li').live('click', function () {
                    var outerInnerId = this.getAttribute('data-value');
                    if (currentCountry == outerInnerId) {
                        return;
                    }
                    currentCountry = outerInnerId;
                    parentsId = outerInnerId;
                    btnDo("getArea2");
                });
                $('#city .selectList li').live('click', function () {
                    var provinceId = this.getAttribute('data-value');
                    if (provinceId == currentCity) {
                        return;
                    }
                    currentCity = provinceId;
                    parentsId = provinceId;
                    btnDo("getArea3");
                });
                $(".pf-avatar-box").hover(function () {
                    $(".pf-edit-avatar").show();
                }, function () {
                    $(".pf-edit-avatar").hide();
                });
            })();

            function btnDo(sEbtn) {
                GtGrid1Action = sEbtn;
                var opart = new jsonRow();
                if (sEbtn == "getUserInfo" || sEbtn == "getArea2" || sEbtn == "getArea3") {
                    opart.AddCell("parentsId", parentsId);
                    opart.AddCell("isAll", "false");
                    opart.AddCell("ACTION", GtGrid1Action);
                }
                ajaxComm(opart);
            };
            //执行AJAX调用时获取参数
            function GetGtParam() {
                var _jsParam = new jsonRow();
                _jsParam.AddCell("ACTION", GtGrid1Action);
                return _jsParam;
            };
            btnDo("getUserInfo");
            function showUserInfo(data) {
                $("#ShowHeadPhoto").attr("src", getUserPhoto(data.rows[0].CUSTOMER_DEFAULT_PIC, data.CUSTOMER_BASEINFO_GENDER) + " 150x150img.jpg");
          
                if (data.rows[0].CUSTOMER_NICK != null) {
                    $("#ShowNickName").text(data.rows[0].CUSTOMER_NICK);
                    $("#txtNickName").val(data.rows[0].CUSTOMER_NICK);
                }

                if (data.rows[0].CUSTOMER_BASEINFO_GENDER != null) {
                    var gender = data.rows[0].CUSTOMER_BASEINFO_GENDER == "M" ? "男" : "女";
                    $("#ShowGender").text(gender);
                } else {
                    $("#ShowGender").text("")
                }
                if (data.rows[0].CUSTOMER_BASEINFO_BIRTH != null && !IsNull(data.rows[0].CUSTOMER_BASEINFO_BIRTH)) {
                    $("#ShowBirth").text(formatDate(new Date(data.rows[0].CUSTOMER_BASEINFO_BIRTH), false));
                } else {
                    $("#ShowBirth").text("");
                }

                if (data.rows[0].CUSTOMER_BASEINFO_MOBILE != null) {
                    $("#ShowMobile").text(data.rows[0].CUSTOMER_BASEINFO_MOBILE);
                } else {
                    $("#ShowMobile").text("");
                }

                if (data.rows[0].CUSTOMER_BASEINFO_PHONE != null) {
                    $("#ShowPhone").text(data.rows[0].CUSTOMER_BASEINFO_PHONE);
                } else {
                    $("#ShowPhone").text("");
                }

                if (data.rows[0].CUSTOMER_BASEINFO_QQ != null) {
                    $("#ShowQQ").text(data.rows[0].CUSTOMER_BASEINFO_QQ);
                } else {
                    $("#ShowQQ").text("");
                }

                if (data.rows[0].CUSTOMER_BASEINFO_EMAIL != null) {
                    $("#ShowEmail").text(data.rows[0].CUSTOMER_BASEINFO_EMAIL);
                } else {
                    $("#ShowEmail").text("");
                }

                if (data.rows[0].CUSTOMER_WECHAT_NO != null) {
                    $("#ShowWeChat").text(data.rows[0].CUSTOMER_WECHAT_NO);
                } else {
                    $("#ShowWeChat").text("");
                }

                if (data.rows[0].CUSTOMER_BASEINFO_PHONE != null) {
                    $("#BirtDate").val(data.rows[0].CUSTOMER_BASEINFO_PHONE);
                } else {
                    $("#BirtDate").val("");
                }

                if (data.rows[0].COUNTRYNAME != null &&
                    data.rows[0].CITYNAME != null &&
                    data.rows[0].DISTINANAME != null) {
                    var AreaString = data.rows[0].COUNTRYNAME + " " + data.rows[0].CITYNAME + " " + data.rows[0].DISTINANAME;
                    $("#ShowAddress").text(AreaString);
                } else {
                    $("#ShowAddress").text("");
                }
            }

            //实例化地区列表
            function setArea(input, width, zIndex, listNum, listValue, listOption, valueId, valueName) {
                $("#" + input).SelectSimu({
                    width: width,
                    zIndex: zIndex,
                    listNum: listNum,
                    listValue: listValue,
                    listOption: listOption,
                    imgSrc: '/jqPlugin/SelectSimu/img/icon_down.png'
                });
                $("#" + input + " input").val(valueId);
                $("#" + input + " span").text(valueName);
            }

            //更新地区下拉列表
            function updateSelet(inputId, data) {
                var selectValue = $("#" + inputId + " .selectList ul");
                selectValue.html("");
                for (var i = 0; i < data.rows.length; i++) {
                    selectValue.append('<li data-value="' + data.rows[i].COUNTRY_CITY_ID + '">' + data.rows[i].COUNTRY_CITY_NME + '</li>');
                }
                if (data.rows.length > 0) {
                    $("#" + inputId + " input").val(data.rows[0].COUNTRY_CITY_ID);
                    $("#" + inputId + " span").text(data.rows[0].COUNTRY_CITY_NME);
                }
            }

            //修改按钮
            function btnChang() {
                $("#modifyHeadPhoto").attr("src", $("#ShowHeadPhoto").attr("src"));
                $("#txtNickName").val($("#ShowNickName").text());
                $("#txtMobile").val($("#ShowMobile").text());
                $("#txtTencentQQ").val($("#ShowQQ").text());
                $("#txtEmail").val($("#ShowEmail").text());
                $("#txtWeChat").val($("#ShowWeChat").text());
                $("#BirtDate").val($("#ShowBirth").text());
                var PhoneArray = $("#ShowPhone").text().split('-');
                $("#txtPhoneTitle").val(PhoneArray[0]);
                $("#txtPhoneContent").val(PhoneArray[1]);
                var gender = $("#ShowGender").text();
                if (gender == "男") {
                    $("#radMale").attr("checked", "checked");
                } else if (gender == "女") {
                    $("#radFemale").attr("checked", "checked");
                }
                $(".modle").hide();
                $(".edit").show();
            }

            //取消按钮
            function btnCancel() {
                $(".modle").show();
                $(".edit").hide();
            }

            function getUserPhoto(userPhoto, sex) {
                if (userPhoto != undefined && userPhoto != null && userPhoto != "") {
                    return userPhoto;
                }
                if (sex == "M") {
                    return "man.jpg";
                } else if (sex == "F") {
                    return "wman.jpg";
                } else {
                    return "djack.jpg";
                }
            }

            function saveUserInfo() {

                //获取性别
                var sex = $("input[name='radGender']:checked").val();
                //获取头像
                var userPhoto = $.trim($("#imgHead img").attr("src"));
                if (!IsNull(userPhoto)) {
                    //var headArray = userPhoto.split('/');
                    //userPhoto = headArray[headArray.length - 1];
                    userPhoto = userPhoto.split(' ')[0];
                }
                if (IsNull(userPhoto)) {
                    if (sex == "M") {
                        userPhoto = "/UpLoad/Djack/man.jpg";
                    } else if (sex == "F") {
                        userPhoto = "/UpLoad/Djack/wman.jpg";
                    } else {
                        userPhoto = "/UpLoad/Djack/djack.jpg"
                    }
                }

                //获取昵称
                var userNickName = $.trim($("#txtNickName").val());

                //获取手机
                var mobilePhone = $.trim($("#txtMobile").val());

                if (IsNull(mobilePhone)) {
                    alert("请填写手机号码");
                    return;

                }
                if (!IsNull(mobilePhone)&&!isZero(mobilePhone)) {
                    alert("请输入正确的手机号码");
                    return;
                }

                //获取固定电话
                var phone = "";

                if (!IsNull($("#txtPhoneTitle").val()) && !IsNull($("#txtPhoneContent").val())) {
                    phone = $.trim($("#txtPhoneTitle").val()) + "-" + $.trim($("#txtPhoneContent").val());

                    if (!isZero($("#txtPhoneTitle").val()) || !isZero($("#txtPhoneContent").val())) {
                        alert("请输入正确的座机号码");
                        return;
                    }
                }
                
                //获取QQ
                var QQ = $.trim($("#txtTencentQQ").val());
                if (!IsNull(QQ) && !isQQ(QQ)) {
                    alert("QQ只能是4-12位数字");
                    return;
                }

                //获取邮箱
                var email = $.trim($("#txtEmail").val());
                if (!IsNull(email) && !IsEmail(email)) {
                    alert("邮箱格式错误");
                    return;
                }
                //获取微信
                var weChart = $.trim($("#txtWeChat").val());

                //获取生日
                var birth = $.trim($("#BirtDate").val());
                if (!IsNull(birth) && !isdate(birth)) {
                    alert("生日格式错误");
                    return;
                }

                //获取地区信息
                var destionId = $.trim($("#destion input").val());
                var cityId = $.trim($("#city input").val());
                var countryId = $.trim($("#country input").val());

                var opart = new jsonRow();
                opart.AddCell("userPhoto", userPhoto);
                opart.AddCell("userNickName", userNickName);
                opart.AddCell("mobilePhone", mobilePhone);
                opart.AddCell("phone", phone);
                opart.AddCell("QQ", QQ);
                opart.AddCell("email", email);
                opart.AddCell("weChart", weChart);
                opart.AddCell("sex", sex);
                opart.AddCell("birth", birth);
                opart.AddCell("destionId", destionId);
                opart.AddCell("cityId", cityId);
                opart.AddCell("countryId", countryId);
                opart.AddCell("ACTION", "setUserInfo");
                ajaxComm(opart);
            }
        </script>
        <!--end JS引用-->
        <%=msBsc.WebUi.Code.QtHtmlGet.GetFloorHtml() %>
    </div>
</body>
</html>
